<template>
  <popup ref="popupRef" :title="qrcodeInfo.title" :width="'400px'" :cancelButtonText="false" :confirmButtonText="false"
    :async="true" @confirm="() => { }">
    <el-image :src="qrcodeInfo.qrcodeUrl"></el-image>
    <div>
      <span>
        {{ qrcodeInfo.activityTypeText }}
      </span>
      <el-divider></el-divider>
    </div>
    <div v-if="qrcodeInfo.activityType == 1">
      <div>
        <span>
          码编号:
        </span>
      </div>
      <div v-for="(item, index) in qrcodeInfo.activityCodeNoList" :key="index">
        <span>{{ item.text }}</span>
      </div>
    </div>
    <div>
      <span>
        抽奖链接地址：{{ qrcodeInfo.url }}
      </span>
      <div class="inline-block">
        <el-button type="text" @click="copy">复制</el-button>
      </div>
    </div>

  </popup>
</template>
<script lang="ts" setup>
import popup from '@/components/popup/index.vue'
import feedback from '@/utils/feedback'
const popupRef = ref<InstanceType<typeof popup>>()
const qrcodeInfo = reactive({
  qrcodeUrl: '',
  url: '',
  title: '',
  activityCodeNoList: [{ codeIdStart: 0, codeIdEnd: 0, totalNum: 0, text: "" }],
  activityType: 0,
  activityTypeText: "",
})
function copy() {
  navigator.clipboard.writeText(qrcodeInfo.url)
  feedback.msgSuccess('复制成功')
}
function open() {
  console.log('open')
  popupRef.value?.open()
}
/**
 *
 * @param title 活动名称
 * @param qrcodeUrl   二维码图片地址
 * @param url 二维码内容url
 */
function setQrcodeInfo(row: any) {
  qrcodeInfo.title = row.title
  qrcodeInfo.activityType = row.type
  qrcodeInfo.activityTypeText = row.typeText
  if (row.type === 1) {
    // 刮刮乐
    qrcodeInfo.qrcodeUrl = row.guagualeQrcodeUrl
    qrcodeInfo.url = row.guagualeUrl
    qrcodeInfo.activityCodeNoList = row.activityCodeNoList
  } else if (row.type === 2) {
    // 二维码链接
    qrcodeInfo.qrcodeUrl = row.qrcodeImgUrl
    qrcodeInfo.url = row.qrcodeRedirectUrl
    qrcodeInfo.activityCodeNoList = row.activityCodeNoList

  }
}
defineExpose({
  copy,
  setQrcodeInfo,
  open
})
</script>
